<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="https://cdn.bootcss.com/openlayers/4.6.5/ol.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/openlayers/4.6.5/ol.js"></script>
    <style type="text/css">
        #map {
            position: absolute;
            width: 100%;
            height: 100%;
            overflow: hidden;
            left: 0;
            top: 0;
        }
    </style>
</head>
<body>
<div id="map" class="map"></div>
<script>
    var map = new ol.Map({
        target: 'map',
        view: new ol.View({
            center: [120, 30],
            zoom: 10,
            projection:"EPSG:4326"
        }),
    });

    var tdt_WGS84_resolutions = [];
    var matrixIds = [];
    for (var i = 1; i < 19; i++) {
        tdt_WGS84_resolutions.push(0.703125 * 2 / (Math.pow(2, i)));
        matrixIds.push(i);
    }

    console.log(matrixIds,tdt_WGS84_resolutions,"ss")
    var layer=new ol.layer.Tile({
        opacity: 0.7,
        source: new ol.source.WMTS({
            url: 'http://t0.tianditu.gov.cn/vec_c/wmts?tk=7480b9d1d86e7fe34f728fa24816daa7',
            layer: 'vec',
            matrixSet: 'c',
            format: 'tiles',
            projection: "EPSG:4326",
            tileGrid: new ol.tilegrid.WMTS({
                origin:[-180,90],
                resolutions:  [0.703125,0.35156249999999994, 0.17578124999999997, 0.08789062499999999, 0.04394531249999999, 0.021972656249999997, 0.010986328124999998, 0.005493164062499999, 0.0027465820312499996, 0.0013732910156249998, 0.0006866455078124999, 0.00034332275390624995, 0.00017166137695312497, 0.00008583068847656249, 0.00004291534423828124, 0.00002145767211914062, 0.00001072883605957031, 0.000005364418029785155],
                matrixIds: matrixIds
            }),
            style: 'default',
            wrapX: true
        })
    });
    // var layertwo=new ol.layer.Tile({
    //     opacity: 0.7,
    //     source: new ol.source.WMTS({
    //         url: 'http://t0.tianditu.gov.cn/cva_c/wmts?tk=7480b9d1d86e7fe34f728fa24816daa7',
    //         layer: 'cva',
    //         matrixSet: 'c',
    //         format: 'tiles',
    //         projection: "EPSG:4326",
    //         tileGrid: new ol.tilegrid.WMTS({
    //             origin:[-180,90],
    //             resolutions:  [0.703125,0.35156249999999994, 0.17578124999999997, 0.08789062499999999, 0.04394531249999999, 0.021972656249999997, 0.010986328124999998, 0.005493164062499999, 0.0027465820312499996, 0.0013732910156249998, 0.0006866455078124999, 0.00034332275390624995, 0.00017166137695312497, 0.00008583068847656249, 0.00004291534423828124, 0.00002145767211914062, 0.00001072883605957031, 0.000005364418029785155],
    //             matrixIds: matrixIds
    //         }),
    //         style: 'default',
    //         wrapX: true
    //     })
    // });
    map.addLayer(layer);
    // map.addLayer(layertwo);
</script>
</body>
</html>